<template>
  <div class>
     <el-tabs type="border-card">
      <el-tab-pane label="现有银行借款情况">
        <div class>
            <el-table :data="tableData" border style="width: 100%">
                <el-table-column  align="center" width="80">
                    <template slot="header">
                    <el-button class="el-icon-circle-plus" @click.prevent="addRow()"></el-button>
                    </template>
                    <template slot-scope="scope">
                    <el-button size="mini" type="danger" class="el-icon-remove"
                    @click="handleDelete(scope.$index, scope.row)"></el-button>
                </template>
                </el-table-column>
                <el-table-column
                    type="index"
                    width="50" label="NO.">
                </el-table-column>
                <el-table-column label="借款行" align="center">
                    <template slot-scope="scope">
                    <el-input v-model="scope.row.loanBank"></el-input>
                    </template>
                </el-table-column>
                <el-table-column label="借款主体" align="center">
                    <template slot-scope="scope">
                    <el-input v-model="scope.row.subBorrow"></el-input>
                    </template>
                </el-table-column>
               <el-table-column label="合同金额(万元)" align="center">
            <template slot-scope="scope">
            <el-input v-model="scope.row.contractAmount"></el-input>
            </template>
            </el-table-column>
            <el-table-column label="起始日期" align="center">
                <template slot-scope="scope">
                <el-date-picker type="date" placeholder="选择日期" v-model="scope.row.startTime" style="width: 100%;" :editable="false"></el-date-picker>
                </template>
            </el-table-column>
            <el-table-column label="结束日期" align="center">
                <template slot-scope="scope">
                <el-date-picker type="date" placeholder="选择日期" v-model="scope.row.endTime" style="width: 100%;" :editable="false"></el-date-picker>
                </template>
            </el-table-column>
            <el-table-column label="备注" align="center">
                <template slot-scope="scope">
                <el-input type="textarea" v-model="scope.row.remark"></el-input>
                </template>
            </el-table-column>
            </el-table>
       </div>
      </el-tab-pane>
    </el-tabs>
    <el-card header="关于上述贷款的说明">
      <el-form :model="formData" label-width="140px" size="mini">
          <el-form-item label="关于上述贷款的说明" prop="loanDesc">
            <el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="formData.loanDesc" style="width: 100%;"></el-input>
          </el-form-item>
      </el-form>
    </el-card> 
  </div>
</template>

<script>
export default {
  components: {},
  data() {
    return {
     tableData: [],
     formData:{}
    };
  },
  computed: {},
  mounted() {
 
  },
  methods: {
    getTableData(){
      return this.tableData
    },
    getFormData(){
      return this.formData
    },
    // 增加行
    addRow() {
      var list = {
          effectiveTerm:"0.00"
      }
      this.tableData.unshift(list)
    },
    handleDelete(index, row) {
       //删除数据库
       if(row.id){
          this.$confirm('此操作将永久删除该条记录, 是否继续?', '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            }).then(() => {
              //删除
              this.$api.formPost( 'biz/projCurrentBank/doRmById',{
                id:row.id
                }).then(res => {
                    if(res.retHead.code=="0000000"){
                          this.$message({
                            type: 'success',
                            message: '删除成功!'
                          });
                          this.tableData.splice(index, 1);
                      }else{
                          this.$message({
                              type: 'error',
                              message: res.retHead.message
                          });
                      }
                });
            }).catch(() => {
              this.$message({
                type: 'info',
                message: '已取消删除'
              });          
            });
        }else{
          this.tableData.splice(index, 1);
        }
      }

  },
  created() {}
};
</script>
<style lang='scss' scoped>

</style>